* {
  margin: 0;
  padding: 0;
}
li {
  list-style: none;
}
html {
  height: 100%;
}
body {
  display: flex;
  height: 100%;
  background-image: linear-gradient(
    100deg,
    rgb(55, 137, 163),
    rgb(235, 250, 188)
  );
  padding: 2.5rem 4.167rem 0;
}
.shuju {
  flex: 1;
  height: 100%;
  /* background-color: red; */
}
.tubiao {
  width: 800px;
  height: 100%;
}

.shuju .inputtxt {
  display: flex;
  font-size: 0.833rem;
}
.shuju .inputtxt p {
  margin: 0 0.417rem;
  height: 1.458rem;
  line-height: 1.458rem;
}
.shuju .inputtxt input {
  width: 8.792rem;
  height: 1.458rem;
  outline: none;
  border: none;
  border-radius: 0.208rem;
}
.shuju .inputtxt button {
  margin-left: 0.1rem;
  height: 1.458rem;
  width: 2.683rem;
  color: #fff;
  outline: none;
  border: none;
  border-radius: 5%;
  background-color: #237b9f;
}
.shuju .inputtxt input {
  padding-left: 0.417rem;
}
table {
  margin-top: 1.25rem;
  border-spacing: 0;
  width: 38.667rem;
  font-size: 0.667rem;
}

table th {
  border-top: 1px solid;
  border-left: 1px solid;
  border-bottom: 1px solid;
  border-color: rgba(205, 215, 218, 0.2);
  height: 1.858rem;
  background-color: #5ca5aa;
}

table th:nth-child(3) {
  border-right: 1px solid;
  border-color: rgba(205, 215, 218, 0.2);
}
table td {
  border-left: 1px solid;
  border-bottom: 1px solid;
  height: 1.858rem;
  text-align: center;
  border-color: rgba(205, 215, 218, 0.2);
}
table td:nth-child(3n) {
  border-right: 1px solid;
  border-color: rgba(205, 215, 218, 0.2);
}

table tr:first-child th:first-child {
  border-top-left-radius: 0.5rem;
}
table tr:first-child th:last-child {
  border-top-right-radius: 0.5rem;
}
table tr:last-child td:first-child {
  border-bottom-left-radius: 0.5rem;
}
table tr:last-child td:last-child {
  border-bottom-right-radius: 0.5rem;
}
.tubiao div {
  float: right;
  width: 30.333rem;
  height: 16.667rem;
  margin-bottom: 2.083rem;
}
.tubiao div h4 {
  display: none;
}
